import React, { useState, useEffect, useRef } from 'react';
import cls from 'classnames';
import styles from './index.less';

import Dashboard from './dashboard';

import { useSelector } from 'umi';

/**
 * 项目管理
 */
const MonitorRight = () => {
  const videoList = useSelector(s => s.monitor.videoList);
  return (
    <div className={styles.right}>
      <div style={{ padding: '26px 0 10px', opacity: 0.7 }}>{`模型总数：${videoList.length ||
        0}`}</div>
      <h4 style={{ fontSize: 20, color: '#fff' }}>实时监控</h4>
      <div className={styles.rightBody}>
        <Dashboard videoList={videoList} />
      </div>
    </div>
  );
};

export default MonitorRight;
